body{
    margin: 0;
    font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
}
.left{
    float: left;
}
.el-header {
    background: #151515;
    padding: 0;
    border: 0;
}
h3,h2,h4,.h3{
    font-size: 120%;
    font-weight: 400;
    color: #1f2f3d;
}
.h3{
    font-size: 22px;
}
.h4{
    font-size: 18px;
}
p{
    font-size: 14px;
    color: #444950;
    line-height: 1.5em;
    margin-top: 0;
}
code {
    font-size: 87.5%;
    color: #e83e8c;
    word-wrap: break-word;
}
button{
    cursor: pointer;
}
.el-button--mini, .el-button--mini.is-round {
    padding: 4px 15px;
}
.b{
    display: inline-flex;
    justify-content: center;
    align-items: center;
    height: 24px;
    line-height: 24px !important;
    padding: 0 8px;
    border: 1px solid #E8EAEE;
    background-color: #F1F2F4;
    border-radius: 4px;
    outline: unset !important;
    margin: 0 6px;
    font-size: 12px;
    font-weight: normal;
    white-space: nowrap;
}
.info-2{
    color: #C0C4CC;
}
.stop{
    margin: 0 4px;
    float: right;
    cursor: pointer;
    color: #F56C6C;
}
i.hover{
    border-radius: 4px;
    padding: 2px;
    cursor: pointer;
    color: #909399;
    border: 1px solid #f5f7fa;
}
i.hover:hover{
    border-color: #e9e9eb;
    background: #f4f4f5;
}
/*滚动条*/
*{
    scrollbar-width: thin;
    scrollbar-color: #e5e5e5 transparent;
}
*:hover{
    scrollbar-color: #8b8b8b #fcfcfc;
}
.el-container>.el-main{
    padding: 15px;
}
.el-menu--horizontal>.el-menu-item,
.el-submenu{
    height: 46px;
    line-height: 46px;
}
.el-menu--horizontal>.el-submenu .el-submenu__title {
    height:auto;
    line-height: 46px;
    border-bottom: inherit;
}
.el-menu-item,.el-submenu__title {
    list-style: none;
    height: auto;
    line-height: inherit;
    list-style: none
}
/*右导航*/
.el-header .group-right{
    float: right;
    margin-right: 10px;
}
.el-header .group-right>div{
    padding: 0 !important;
}
.el-header .group-right>ul>li{
    display: inline-block;
    vertical-align: middle;
    position: relative;
}
/* menu-group 箭头图标占位正常 */
/* 现在的问题是下拉菜单的方位不对 */
.el-header .group-right ul li .el-icon-arrow-down{
    position: static;
    vertical-align: middle;
    margin-left: 8px;
    margin-top: -3px;
}
.el-header .group-right ul li .el-icon-arrow-right{
    display: none;
}
.el-header .group-right .submenu{
    top: 49px !important;
    right: 0px !important;
    left: auto !important;
}
.el-header .el-dropdown-link{
    color: #fff;
    border: 1px solid #525252;
    border-radius: 6px;
    padding: 5px 10px;
}

.el-header .submenu ul{
    background-color: #fff !important;
}
.el-header .submenu li{
    background-color: inherit !important;
    color: #303133 !important;
}
.el-header .submenu li:hover{
    background-color: #f2f2f2 !important;
}
.el-header .submenu a{
    text-decoration: auto;
    color: #303133;
}
.el-header .icon .el-submenu__title{
    padding:0;
}
.el-header .item{
    padding: 0 10px;
}
.el-header .item .el-submenu__title{
    padding:0;
}
.el-header .el-divider--horizontal{
    margin: 0;
}
.el-header .el-submenu .el-menu-item{
    min-width: 130px;
}
.el-menu--popup {
    min-width: 120px;
}

.icon{
    font-size: 24px;
}
.primary{
    color: #409EFF;
    cursor: default;
}
.warning{
    color: #e6a23c;
    cursor: default;
}
.success{
    color: #67c23a;
    cursor: default;
}
.danger{
    color: #f56c6c;
    cursor: default;
}
.version{
    margin: 0;
    text-align: right;
    color: #f2f2f2;
}
i.el-alert__icon{
    vertical-align: middle;
}
.is-light{
    background-color: #fef0f0 !important;
    color: #f56c6c;
}
.is-light.el-alert--info {
    background-color: #f4f4f5 !important;
}
.task-item-icon{
    display: inline;
    min-width: 10px;
    border-radius: 3px;
    padding: 3px 4px 3px;
    vertical-align: text-bottom;
    font-size: 12px;
    font-style: normal;
    color: #fff;
    text-align: center;
    zoom: .7;
}

/*搜索框*/
.search-form .el-form-item {
    margin: 6px 5px 6px 0;
}
.search-form .el-form-item__label{
    padding-right: 5px;
}
.search-form .el-input__inner{
    padding: 0 6px;
}
/*边栏*/
.aside-card{
    margin-bottom: 15px;
}
.aside-card .el-card__header{
    padding: 5px 15px;
    background: #f2f2f2;
    font-weight: 600;
}
.aside-card .el-card__body{
    padding: 0px 0 8px;
    overflow: auto;
}
/*.aside-card a{*/
/*    text-decoration:none;*/
/*    outline: none;*/
/*}*/
.aside-card ol{
    margin: 0;
    padding-left: 30px;
}
.aside-card ol li{
    margin: 3px 0;
    border-bottom: 1px solid #f5f5f5;
    padding: 7px 2px;
    font-size: 14px;
    white-space: nowrap;
}
.aside-card ol li .el-link{
    display: inline;
}
.aside-card ol li .el-link{
    display: inline;
}

.form-inline .el-input{
    width: auto;
}
/*任务表单弹窗*/
.pipeline-form{
    padding: 0 10px 10px 10px;
    color: #606266;
}
.config-form-box .el-dialog__header{
    padding: 14px 20px 10px;
}
.config-form-box .el-dialog__body{
    padding: 6px 20px;
}
.config-form-box .el-form-item{
    margin-bottom: 10px;
}
/*.config-form-box .el-tabs{*/
/*    margin: 10px 0;*/
/*}*/
.config-form-box .el-tabs--border-card>.el-tabs__content{
    padding-top: 0;
    padding-bottom: 10px;
}
.config-form-box .el-tabs--border-card>.el-tabs__content .el-form-item{
    margin: 6px 0;
    overflow: hidden;
}
/*.config-form .el-dialog__footer,*/
/*.pipeline-form .el-dialog__footer{*/
/*    padding: 10px 0 10px 0;*/
/*}*/
.input-input .el-input-group__prepend{
    background: #fff;
}
.input-input .el-input-group__prepend:has(.is-disabled){
    background-color: #F5F7FA;
}
.input-input .el-input-group__prepend input{
    padding: 0;
}
.input-input .el-input-group__prepend .el-input__suffix{
    right: 0;
}
.input-input .el-input-group__prepend .el-input__suffix input{
    padding-left: 10px;
}
.el-input-group__prepend{
    /*background: none;*/
    padding: 0 10px;
}
.el-input-group__prepend .el-select{
    margin: 0;
    width: 120px;
}
.http_header_box .el-input-group__prepend{
    width: 240px;
}
.var_fields .el-input-group__prepend{
    width: 350px;
}
.el-input-group__append,.el-input-group__prepend {
    padding: 0 12px;
}
.el-input--small.el-input-group div input{
    line-height: 30px;
    height: 30px;
    border: none;
}
.el-dropdown-link{
    cursor: pointer;
}
.el-autocomplete{
    width: 100%;
}
/* 任务表单 sql 展示 */
.sql-show-warp{
    overflow-y: auto;
    max-height: 360px;
    margin: 8px 0;
}
.sql-show-warp a{
    margin: 0 4px 0 4px;
}
.sql-show-warp .input-box pre{
    white-space: nowrap;
    min-height: 45px;
}

/* 日志 */
.config-log {}
/* 日志 踪迹 */
.trace-page{
    position: relative;
    margin-bottom: 50px;
}
.trace-page .median{
    position: absolute;
    height: 100%;
    width: 2px;
    background: #d3e3fd;
    z-index: 1;
    cursor: col-resize;
}
.trace-page .trace-header{
    display: flex;
    color: #999;
}
.trace-page .label{
    width: 292px;
    font-weight: 500;
    font-size: 1.17em;
    padding: 2px 4px;
}
.trace-page .total-desc{
    padding-left: 6px;
}
.trace-page .total-desc span{
    padding-right: 12px;
}
.trace-page .total-desc b{
    color: #444;
}
.trace-page .trace-wrapper td.el-table__cell,
.trace-page .trace-wrapper th.el-table__cell.is-leaf {
    border-bottom: 1px solid #fff;
}
.trace-page .el-table td.el-table__cell{
    vertical-align: top;
    padding:0;
}
.trace-page .trace-wrapper td:first-child .cell{
    display: flex;
    padding-left: 6px;
}
.trace-page .trace-wrapper .cell{
    padding: 0;
}
.span-label{
    color: #1b1b1b;
}
.is-light{
    color: #dc362e;
}
.trace-page .trace-wrapper .cell .span-label{
    flex: 1;
    background: #f7f9fd;
    cursor: pointer;
    padding: 0 4px;
    overflow: hidden;
}
.trace-page .trace-wrapper .el-table__empty-block{
    min-height: auto;
}
.trace-page .trace-wrapper .el-table__empty-block .el-table__empty-text{
    line-height: 120%;
}

.trace-page .span-detail{
    overflow: auto;
    width: 100%;
    min-height: 50px;
    position: relative;
    /*background: #e6e6e6;*/
}
.trace-page .span-detail table tr td:first-child{
    color: #999;
}
.trace-page .span-bar-wrapper{
    width: 100%;
    background: #f7f9fd;
    cursor: pointer;
}
.trace-page .span-bar{
    position: relative;
}
.trace-page .span-bar-label{
    position: absolute;
    top: 0;
    white-space: nowrap;
    margin: 0 4px;
}
.trace-page .span-header{
    cursor: pointer;
    overflow: hidden;
    white-space: nowrap;
    background: #edeff6;
    border: 1px solid #d3e3fd;
}
.trace-page .span-detail .el-breadcrumb{
    display: inline-block;
    vertical-align: middle;
}
.trace-page .span-logs-box{
    /*border: 1px solid;*/

}

.trace-page .span-logs-box .span-wrapper{
    padding-left: 14px;
}
.trace-page .span-logs-box .span-wrapper .span-header{
    border: none;
    padding: 4px 0;
    background: #f7f9fd;
}

.sort-drag-box{
    max-height: 500px;
    overflow: auto;
}
.sort-drag-box .drag{
    cursor: n-resize;
    position: absolute;
    left: 0;
    top: 0;
    display: flex;
    align-items: center;
    height: 100%;
}
.sort-drag-box .item-drag-current{
    background: #c8ebfb !important;
}
.sort-drag-box .item-close{
    cursor: pointer;
    position: absolute;
    right: 6px;
    color: #72767b;
}
.sort-drag-box .item-close:hover{
    color: #191919;
}
.sort-drag-box .sortable-chosen{
    color:red;
}

.config-select-wrap .el-dialog__body{
    padding: 0px 20px;
}
.config-select .el-table .el-table__cell{
    padding: 8px 0;
}
b code{
    font-weight: normal;
}
.input-box{
    position: relative;
    border-radius: 4px;
    background: #f8f8f9;
    border: 1px solid #ebeef5;
    padding: 6px 22px 7px 8px;
    margin-bottom: 4px;
    max-height: 200px;
    line-height: 133%;
}
.input-box pre{
    margin: 0;
    overflow: auto;
    white-space: break-spaces;
    max-height: 180px;
}
.input-box .input-body{
    overflow: auto;
    max-height: 180px;
}
.input-box:hover .input-header{
    display: block;
}
.input-header{
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    padding: 2px 2px;
    width: 24px;
    text-align: right;
}
.input-header i{
    cursor: pointer;
}
pre code, .sql-show-warp code{
    color: #606266;
}

.my-work .header{
    border-bottom: 1px solid #f5f5f5;
    padding: 10px 2px;
}
.my-table-icon{
    font-size: 15px;
    width: 22px;
    display: inline-block;
    cursor: pointer;
    margin-right: 8px;
}
.my-table-icon i{
    background: #409EFF;
    color: #fff;
    border-radius: 50%;
    padding: 1px;
}

.my-role{
    margin: 20px 10px;
}
.my-role .body{
    padding-bottom: 10px;
    position: relative;
    overflow: auto;
}
.my-role .footer,
.my-setting .footer{
    position: fixed;
    bottom: 0;
    z-index: 1;
    background: #fff;
    width: 100%;
    border-top: 1px solid #f2f2f2;
    padding: 10px 20px;
}
.active{
    background: #f0f7ff;
    color: #409eff;
}
/* 设置页面 */
.my-setting .setting-wrap{
    position: relative;
    overflow-y: auto;
    padding-bottom: 20px;
}
.my-setting .setting-wrap form{
    max-width: 800px;
}
.my-setting .setting-wrap .el-card__header{
    padding: 4px 20px;
}
.my-setting .setting-wrap th{
    background: #f5f7fa;
    padding: 0;
}
/* 详情页面 */
#config-detail .el-aside{
    width: 321px;
    padding: 70px 0 10px 10px;
}
#config-detail .el-aside .el-descriptions-item__label{
    width: 64px;
}
#config-detail .el-aside .b{
    margin: 0;
}

#config-detail .title{
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e8eaee;
    padding-bottom: 12px;
}
#config-detail .title p{
    margin: 0;
    font-weight: 200;
    font-size: 13px;
    color: #909399;
}
#config-detail .detail-wrap .el-tabs__content{
    min-height: 200px;
}

#config-detail .detail-wrap .el-table__cell{
    padding: 6px 0;
    border: none;
}
#config-detail .detail-wrap .el-table__cell .cell{
    line-height: 18px;
    font-weight: 400;
}

#config-detail .detail-wrap .sub-table{
    width: 102%;
}
#config-detail .detail-wrap .sub-table tr{
    background: none;
}
#config-detail .detail-wrap .sub-table td{
    width: 33%;
}
#config-detail .detail .el-form-item{
    margin: 0;
}

/* 状态弹窗 */
/*.status-change-warp .el-dialog__header{*/
/*    display: none;*/
/*}*/
.status-change-warp .el-dialog__header{
    padding: 10px 20px 5px;
    overflow: hidden;
}
.status-change-warp .el-dialog__body{
    padding: 0;
    border-top: 1px solid #e4e7ed;
}
.status-change-warp .el-dialog__body .el-tabs__nav-wrap.is-left{
    padding: 26px 0 20px 14px;
    background-color: #fafafb;
    min-height: 280px;
}
.status-change-warp .is-active button{
    border-color: #409EFF;
    color: #409EFF;
}
.status-change-warp .el-dialog__body .el-tabs__nav-wrap.is-left button{
    width: 100%;
}
.status-change-warp .el-dialog__body .el-tabs__content{
    min-height: 320px;
}
.status-change-warp .el-dialog__body .el-tab-pane{
    padding: 30px 30px 68px 20px;
    overflow: auto;
    box-sizing: border-box;
    height: 100%;
}
.status-change-warp form .el-form-item__label{
    text-align: left;
}
.status-change-warp .status-change-footer{
    position: absolute;
    bottom: 20px;
    margin: 0;
    right: 20px;
}